@layout("/common/_container.html",{js:["/assets/modular/system/project/proFlowChart.js"]}){
<link rel="stylesheet" href="${ctxPath}/assets/common/css/project.css?v=${constants.getReleaseVersion()}" media="all">
<style>
    .layui-table-cell {
        line-height: 100%!important;
    }
    .layui-table dl {
        width: 120px;
        text-align: center;
        color: #666;
        display: inline-block;
    }

    .layui-table dt {
        width: 25px;
        height: 25px;
        border-radius: 50%;
        border: 2px solid #e1e2e6;
        background-color: #FFF;
        margin: 0 auto 10px;
        z-index: 2;
        position: relative;
    }

    .layui-table dt.yellow {
        background-color: yellow!important;
        border-color: #ffed00!important;
        color: #86b142!important;
    }


    .layui-table dt::before {
        content: '';
        display: block;
        width: 110px;
        height: 2px;
        background: #e1e2e6;
        position: absolute;
        top: 10px;
        right: 0;
        margin-right: -110px;
    }

    .layui-table dl:last-child dt::before {
        display: none;
    }

    .layui-table dd {
        margin: 0;
        line-height: 150%;
    }

    .layui-table dl:last-child::before {
        display: none;
    }

    .layui-table dt::before {
        background: #16C784;
    }

    .layui-table dt {
        background-color: #16C784;
        border-color: #16C784;
        color: #FFFFFF;
        line-height: 22px;
        font-size: 11px;
    }

    .layui-table dt:last-child::before {
        content: '';
        display: block;
        width: 98px;
        height: 2px;
        position: absolute;
        top: 13px;
        left: 72px;
    }

    .layui-table .line-box dl:last-child {
        color: #0E2231;
        font-weight: 700;
    }

    .layui-table .line-box dl:last-child dt {
        background-color: #cd1621;
        border-color: #EA3943;
        /*background-color: #3861FB;*/
        /*border-color: #3861FB;*/
        color: #FFFFFF;
        line-height: 22px;
        font-size: 11px;
    }

    .layui-table dt {
        line-height: 22px;
    }

    .layui-table .spanNumber {
        font-size: 18px;
    }
</style>
<style>
    /*弹性布局*/
    .flex {display: flex;}
    .flex.center {align-items: center;}
    .flex.stretch{align-items: stretch;}
    .flex.end{align-items: flex-end;}
    .flex.row{flex-flow: row;}
    .flex.row-reverse{flex-flow: row-reverse;}
    .flex.column{flex-flow: column;}
    .flex.justify{justify-content:space-between;}
    .flex.jc{-ms-justify-content:center;justify-content:center;}
    .flex.flow{flex-flow: wrap;}
    .flex.hide{display: none;}
</style>

<style type="text/css">
    .layui-table-cell {
        height: auto;
        line-height: 55px;
    }
    .layui-table-page{
        display:none;
    }
</style>
<div class="layui-body-header">
    <span class="layui-body-header-title">工程流水</span>
</div>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
            <div class="layui-card">
                <div class="layui-card-body">
                    <div class="layui-form toolbar">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <input id="condition" class="layui-input" type="hidden"/>
                            </div>
                        </div>
                    </div>
                    <table class="layui-table" id="taskFlowTable" lay-filter="taskFlowTable"></table>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn layui-btn-primary" type="button" id="backupPage">&emsp;返回&emsp;</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script id="statusTpl" type="text/html">
    <div class="line-box" style="overflow-x: scroll">
            {{#  layui.each(d.taskFlowResultList, function(index, item){ }}
        <dl>
<!--            <dt>{{ item.proId }}</dt>-->
            {{#  if(item.taskId == 5&&item.status==0){ }}
            <dt class="yellow">{{index + 1}}</dt>
            {{#  }else if (item.taskId == 5&&item.status==1){ }}
            <dt>{{index + 1}}</dt>
            {{#   }else if(item.taskId == 6&&item.status==0){ }}
            <dt class="yellow">{{index + 1}}</dt>
            {{#  }else if (item.taskId == 6&&item.status==1){ }}
            <dt>{{index + 1}}</dt>
            {{#  }else if(item.taskId == 7&&item.status==0){ }}
            <dt class="yellow">{{index + 1}}</dt>
            {{#  }else if (item.taskId == 7&&item.status==1){ }}
            <dt>{{index + 1}}</dt>
            {{# } else { }}
            <dt>{{index + 1}}</dt>
            {{#  } }}
            <dd>{{ item.taskName }}</dd>
            <dd>{{layui.util.toDateString(item.createTime, 'MM-dd')|| ''}}</dd>
            <dd>{{ item.statusName }}</dd>
        </dl>
            {{#  }); }}
            {{#  if(d.taskFlowResultList == ""){ }}
            无数据
            {{#  } }}
    </div>
</script>


@}
